@extends('admin.layout.main')
@section('content')
    <style>
        .example-modal .modal {
          position: relative;
          top: auto;
          bottom: auto;
          right: auto;
          left: auto;
          display: block;
          z-index: 1;
        }
        .example-modal .modal {
          background: transparent !important;
        }
    </style>
    <section class="content-header">
      <h1>
        下级权限列表
      </h1>
      <ol class="breadcrumb">
        <li><a href="javascript:void(0)"><i class="fa fa-dashboard"></i> 权限管理</a></li>
        <li class="active"><a href="/admin/permissions">权限列表</a></li>
        <li class="active">下级权限</li>
      </ol>
    </section>
    <!-- Main content -->
    <section class="content">
        <!-- Small boxes (Stat box) -->
        <div class="row">
            <div class="col-lg-12 col-xs-6">
                <div class="box">
                    <a type="button" class="btn " href="/admin/permissions/create"><i class="fa fa-fw fa-plus"></i>增加权限</a>
                    <!-- /.box-header -->
                    <div class="box-body">
                        <table class="table table-bordered table-hover" id="sub_permission">
                            <div class="dataTables_filter">
                                <form action="/admin/permissions/sub_search/{{$permission->id}}" method="GET">
                                    <button type="submit" class="btn btn-info btn-sm">查询:</button><input type="search" name="keywords" class="form-control input-sm">
                                </form>
                            </div>
                            <thead>
                                <tr>
                                    <th style="width: 10px">#</th>
                                    <th>权限规则</th>
                                    <th>权限名称</th>
                                    <th>权限描述</th>
                                    <th>操作</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach($permissions as $permission)
                                    <tr id="tr_{{$permission->id}}">
                                        <td>{{$permission->id}}</td>
                                        <td>{{$permission->name}}</td>
                                        <td>{{$permission->label}}</td>
                                        <td>{{$permission->description}}</td>
                                        <td>
                                            <a class="btn" href="/admin/permissions/edit/{{$permission->id}}">
                                                <i class="fa fa-fw fa-edit"></i>权限管理
                                            </a>
                                            <a class="btn del-per" per-id="{{$permission->id}}" href="javascript:void(0)">
                                                <i class="fa fa-fw fa-close"></i>删除权限
                                            </a>
                                        </td>
                                    </tr>
                                @endforeach
                            </tbody>    
                        </table>
                    </div>  
                    {{$permissions->links()}}
                </div>
            </div>
        </div>
    </section>
    <div class="modal fade" id="modal-default">
      <div class="modal-dialog">
        <div class="modal-content">
          <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span></button>
            <h4 class="modal-title"></h4>
          </div>
          <div class="modal-body">
            <p></p>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-default pull-left" data-dismiss="modal">关闭</button>
            <button type="button" data-url="" class="btn btn-primary modal-confirm">确认</button>
          </div>
        </div>
        <!-- /.modal-content -->
      </div>
      <!-- /.modal-dialog -->
    </div>
    <script type="text/javascript">
      $(function () {
        $('#sub_permission').DataTable({
          "paging": false,
          "lengthChange": false,
          "searching": false,
          "info": false,
          "autoWidth": true,
          "columns": [
            {"orderable": false},
            null,
            null,
            null,
            {"orderable": false}
          ]
        });
      });
      $('.del-per').click(function(){
            var per_id = $(this).attr('per-id'),
                url = '/admin/permissions/delete/'+per_id;
            pop_modal('确认删除', '确定删除此权限吗?', url);
        });

        function pop_modal(title, content, url) {
            $('.modal-title').text(title);
            $('.modal-body').html('<p>'+content+'</p>');
            $('.modal-confirm').attr('data-url', url);
            $('#modal-default').modal('show');
        }

        $('.modal-confirm').click(function(){
            var confirm_this = $(this);
            $('#modal-default').modal('hide');
            $('#modal-default').on('hidden.bs.modal', function () {
                var url = $('.modal-confirm').attr('data-url');
                if (url == '') {
                    $('#modal-default').modal('hide');
                } else {
                    $.ajax({
                      type: "get",
                      dataType: "json",
                      url: url,
                      data: {},
                      success: function (data) {
                        if (data.flag) {
                            $('#tr_'+data.pid).remove();
                        } else {
                            pop_modal('删除失败', data.msg, '');
                        }
                      }
                    });
                }
            });
        });
    </script>
@endsection    
    <!-- /.content -->
 